<template>
  <div>
    <!-- main-slider -->
    <section class="w3l-main-slider banner-slider" id="home">
      <div class="owl-one owl-carousel owl-theme">
        <div class="item">
          <div class="slider-info banner-view banner-top1">
            <div class="container">
              <div class="banner-info header-hero-19">
                <p class="w3hny-tag">Quality With Integrity</p>
                <h3 class="title-hero-19">The facility of applied intelligence.</h3>
                <p class="w3ban-para">
                  Lorem ipsum viverra feugiat. Pellen tesque libero ut justo.
                  <span class="w3-xtrap">Ultrices in ligula,semper at tempufddfel.</span>
                </p>
                <NuxtLink to="/about" class="btn btn-style btn-primary mt-sm-5 mt-4">
                  Read More
                  <i class="fas fa-angle-double-right ms-2"></i>
                </NuxtLink>
              </div>
            </div>
          </div>
        </div>
        <div class="item">
          <div class="slider-info banner-view banner-top2">
            <div class="container">
              <div class="banner-info header-hero-19">
                <p class="w3hny-tag">Simply certified.</p>
                <h3 class="title-hero-19">Reliable engineering takes many forms</h3>
                <p class="w3ban-para">
                  Lorem ipsum viverra feugiat. Pellen tesque libero ut justo.
                  <span class="w3-xtrap">Ultrices in ligula,semper at tempufddfel.</span>
                </p>
                <NuxtLink to="/about" class="btn btn-style btn-primary mt-sm-5 mt-4">
                  Read More
                  <i class="fas fa-angle-double-right ms-2"></i>
                </NuxtLink>
              </div>
            </div>
          </div>
        </div>
        <div class="item">
          <div class="slider-info banner-view banner-top3">
            <div class="container">
              <div class="banner-info header-hero-19">
                <p class="w3hny-tag">Quality With Integrity</p>
                <h3 class="title-hero-19">The facility of applied intelligence.</h3>
                <p class="w3ban-para">
                  Lorem ipsum viverra feugiat. Pellen tesque libero ut justo.
                  <span class="w3-xtrap">Ultrices in ligula,semper at tempufddfel.</span>
                </p>
                <NuxtLink to="/about" class="btn btn-style btn-primary mt-sm-5 mt-4">
                  Read More <i class="fas fa-angle-double-right ms-2"></i>
                </NuxtLink>
              </div>
            </div>
          </div>
        </div>
        <div class="item">
          <div class="slider-info banner-view banner-top4">
            <div class="container">
              <div class="banner-info header-hero-19">
                <p class="w3hny-tag">Simply certified.</p>
                <h3 class="title-hero-19">Reliable engineering takes many forms</h3>
                <p class="w3ban-para">Lorem ipsum viverra feugiat. Pellen tesque libero ut justo. <span
                    class="w3-xtrap">Ultrices in ligula,semper at tempufddfel.</span> </p>
                <NuxtLink to="/about" class="btn btn-style btn-primary mt-sm-5 mt-4">
                  Read More <i class="fas fa-angle-double-right ms-2"></i>
                </NuxtLink>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="w3l-stats-section stats-con mt-5">
        <div class="stats_info counter_grid ps-0">
          <p class="counter">3500 </p>
          <h3>Factories</h3>
        </div>
        <div class="stats_info counter_grid">
          <p class="counter">4360</p>
          <h3>Projects</h3>
        </div>
      </div>

    </section>
    <!-- //main-slider -->
  </div>
</template>

<script lang="ts" setup>
console.log('index mounted')
onMounted(() => {
  initHome()
})
</script>

<style></style>